<template>
    <h2>信息修改</h2>
    <table class="table">
        <thead>
            <tr>
                <th>编号</th>
                <th>{{ data.hid }}</th>
            </tr>
            <tr>
                <th>房间名称</th>
                <th>
                    <input type="text" v-model="data.hame">
                </th>
            </tr>
            <tr>
                <th>房型</th>
                <th>
                    <select v-model="data.fx">
                        <option value="0">请选择</option>
                        <option value="1">双人床</option>
                        <option value="2">总统套房</option>
                    </select>
                </th>
            </tr>
            <tr>
                <th>房号</th>
                <th>
                    <select v-model="data.fh">
                        <option value="0">请选择</option>
                        <option value="1">1001</option>
                        <option value="2">1002</option>

                    </select>
                </th>
            </tr>
            <tr>
                <th></th>
                <th>
                    <input type="button" value="修改" @click="audd">
                </th>
            </tr>
        </thead>
    </table>
</template>

<script setup lang="ts">
import axios from 'axios';
import { onMounted, ref } from 'vue';
import { useRoute } from 'vue-router';
import { useRouter } from 'vue-router';
const router=useRouter()
const route=useRoute()
const data=ref({
  "hid": 0,
  "hame": "",
  "fx": 0,
  "fh": 0
})
onMounted(()=>{
    fantian()
})

const fantian=()=>{
    axios.get("https://localhost:7099/api/VS/Fantian",{params:{id:route.query.id}}).then(res=>{
        data.value=res.data;
    })
}


const audd=()=>{
    axios.post("https://localhost:7099/api/VS/Update",data.value).then(res=>{
        if(res.data>0)
    {
        alert('修改成功')
        router.push({path:"/show"})
    }
    else
    {
        alert('修改失败')
        return;
    }
    })
}
</script>

<style scoped>

</style>